<template>
  <div class="box">
    <header class="header">
      <van-nav-bar title="详情" left-arrow @click-left="$router.back()" />
    </header>
    <div class="content">
      <ul>
        <li>
          <img style="width:100%" :src="obj.image" alt />
          <div>
            <p>{{obj.title}}</p>
            <p style="color:red">￥{{obj.price}}</p>
          </div>
        </li>
      </ul>
    </div>
    <footer>
      <van-action-bar>
        <van-action-bar-icon icon="chat-o" text="客服" color="#ee0a24" />
        <van-action-bar-icon icon="cart-o" text="购物车" />
        <van-action-bar-icon icon="star" text="已收藏" color="#ff5000" />
        <van-action-bar-button type="warning" text="加入购物车" @click="goLogin" />
        <van-action-bar-button type="danger" text="立即购买" />
      </van-action-bar>
    </footer>
  </div>
</template>
<script setup>
import request from "@/utlis/request.js";
import { useRoute } from "vue-router";
import { useRouter } from 'vue-router'
const router = useRouter()
const route = useRoute();
import { onMounted, ref } from "vue";
const obj = ref({});
onMounted(() => {
  request
    .get("/detail", {
      params: {
        id: route.params.id
      }
    })
    .then(res => {
      if (res.data.code == 200) {
        obj.value = res.data.data;
      }
    });
});
const goLogin=()=>{
    if(localStorage.getItem('token'))
    {
        console.log('已经登录')
    }
    else
    {
        router.push('/login')
    }
}
</script>